<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="referrer" content="no-referrer" />
    <title>豆瓣电影</title>
    <link rel="stylesheet" href="css/dist/index.css">
    <link rel="stylesheet" href="css/swiper-bundle.min.css">
    <link rel="stylesheet" href="iconfont/iconfont.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/swiper-bundle.min.js"></script>
    <script src="js/ajax.js"></script>
    
    <script src="js/cookie.js"></script>
    <script src="js/link.js"></script>
    <script src="js/search.js"></script>
    <script src="js/index.js"></script> 
</head>

<body>
    <header>
        <ul>
            <li><a href="#">豆瓣</a></li>
            <li><a href="#">读书</a></li>
            <li><a href="#">电影</a></li>
            <li><a href="#">音乐</a></li>
            <li><a href="#">同城</a></li>
            <li><a href="#">小组</a></li>
            <li><a href="#">阅读</a></li>
            <li><a href="#">FM</a></li>
            <li><a href="#">时间</a></li>
            <li><a href="#">豆品</a></li>
        </ul>
        <ul>
            <li><a href="#">下载客户端</a></li>
            <li class='lo'><a href="html/login.html">登陆/注册</a></li>
        </ul>
    </header>
    <div id='logo'>
        <div class='logo'>
            <h1><a href="#">豆瓣电影</a></h1>
            <div class='logoBox'><input type="search" name="" id="search" placeholder="搜索电影、电视剧、综艺、影人"><button><i
                        class="iconfont icon-sousuo"></i></button>
                <div class='search'>
                    <ul>

                    </ul>
                </div>
            </div>
        </div>
    </div>
    <nav>
        <div class="nav">
            <ul>
                <li><a href="#">影讯/购票</a></li>
                <li><a href="html/movieList.html">选电影</a></li>
                <li><a href="html/tvList.html">电视剧</a></li>
                <li><a href="#">排行榜</a></li>
                <li><a href="#">分类</a></li>
                <li><a href="#">影评</a></li>
                <li><a href="#">2020年度榜单</a></li>
                <li><a href="#">2020书影报告</a></li>
            </ul>
        </div>
    </nav>
    <div id=all>
        <div class="all">
            <div id="left">
                <!-- 正在热映 -->
                <div class='hot'>
                    <h2>正在热映<span><a href="#">全部正在热映 》</a></span><span><a href="#">即将上映 》</a></span><button
                            class="swiper-button-prev" style="left: 713px;top: 39px;"></button><b
                            class="swiper-pagination"></b><button class="swiper-button-next"
                            style="left: 811px;top: 33px;"></button></h2>

                    <div class="swiper-container swiper-no-swiping" id="swiper1">
                        <div class="swiper-wrapper">
                            
                        </div>
                    </div>

                </div>
                <div class="hotMovie">
                    <ul>
                        <span>最近热门电影</span>
                        <li><button class="light btn" tag1='热门' type1='movie'>热门</button></li>
                        <li><button class='btn' tag1='最新' type1='movie' >最新</button></li>
                        <li><button class='btn' tag1='豆瓣高分' type1='movie'>豆瓣高分</button></li>
                        <li><button class='btn'  tag1='冷门佳片' type1='movie'>冷门佳片</button></li>
                        <li><button class='btn'  tag1='华语' type1='movie'>华语</button></li>
                        <li><button class='btn'  tag1='欧美' type1='movie'>欧美</button></li>
                        <li><button class='btn'  tag1='韩国' type1='movie'>韩国</button></li>
                        <li><button  class='btn' tag1='日本' type1='movie'>日本</button></li>
                        <a href="#">更多》</a>
                    </ul>
                    <div class="swiper-container swiper-no-swiping" id="swiper2">
                        <div class="swiper-wrapper">
                        </div>
                    </div>
                    <div class="bts">
                        <button class="swiper-button-prev2"></button>
                        <b class="swiper-pagination2"></b>
                        <button class="swiper-button-next2"></button>
                    </div>
                    <div class='hotTv'>
                        <ul>
                            <span>最近热门电视剧</span>
                            <li><button class="light btn" tag1='热门' type1="tv">热门</button> </li>
                            <li><button class='btn'  tag1='国产剧' type1="tv">国产剧</button></li>
                            <li><button  class='btn' tag1='综艺' type1="tv">综艺</button></li>
                            <li><button class='btn'  tag1='美剧' type1="tv">美剧</button></li>
                            <li><button class='btn'  tag1='日剧' type1="tv">日剧</button></li>
                            <li><button class='btn'  tag1='韩剧' type1="tv">韩剧</button> </li>
                            <li><button  class='btn' tag1='日本动画' type1="tv">日本动画</button></li>
                            <li><button  class='btn' tag1='纪录片' type1="tv">纪录片</button></li>
                            <a href="#">更多》</a>
                        </ul>
                        <div class="swiper-container swiper-no-swiping" id="swiper3">
                            <div class="swiper-wrapper">
                            </div>
                        </div>
                        <div class="bts">
                            <button class="swiper-button-prev3"></button>
                            <b class="swiper-pagination3"></b>
                            <button class="swiper-button-next3"></button>
                        </div>
                    </div>

                    <div class="suggest">
                        <h2>热门推荐<span><button class="swiper-button-prev4"></button>
                                <b class="swiper-pagination4"></b>
                                <button class="swiper-button-next4"></button></span></h2>
                        <div class="swiper-container swiper-no-swiping" id="swiper4">
                            <div class="swiper-wrapper">
                                <div class='swiper-slide sBox'>
                                    <div class="imgBox"><img src="img/1.jpg" alt="夏日有情天"></div>
                                    <div class="textBox">
                                        <h3>皮克斯《夏日友晴天》中字预告</h3>
                                        <p>
                                            聚焦两个男孩的神仙友情，满满意式清新夏日风！内地有望引进！
                                        </p>
                                    </div>

                                </div>
                                <div class='swiper-slide sBox'>
                                    <div class="imgBox"><img src="img/2.jpg" alt="毒液2"></div>
                                    <div class="textBox">
                                        <h3>汤老湿主演《毒液2》中字预告</h3>
                                        <p>
                                            原班人马回归主演，9月24日北美上映！
                                        </p>
                                    </div>

                                </div>
                                <div class='swiper-slide sBox'>
                                    <div class="imgBox"><img src="img/3.jpg" alt="基地"></div>
                                    <div class="textBox">
                                        <h3>科幻神作改编美剧《基地》预告</h3>
                                        <p>
                                            李·佩斯、杰瑞德·哈里斯主演，9月24日上线！！
                                        </p>
                                    </div>

                                </div>
                                <div class='swiper-slide sBox'>
                                    <div class="imgBox"><img src="img/4.jpg" alt="王国：北方的阿信"></div>
                                    <div class="textBox">
                                        <h3>Netflix《王国：北方的阿信》预告</h3>
                                        <p>
                                            全智贤主演Netflix高分丧尸剧《王国》外传，7月23日Netflix上线！！
                                        </p>
                                    </div>

                                </div>
                            </div>
                        </div>

                    </div>
                    <div id='reviews'>
                        <h3>最受欢迎影评 <a href="#">更多热门影评》</a> <a href="#">新片影评》</a></h3>
                       
                    </div>
                </div>
            </div>
            <div id='right'>
                <ul class="rankList">
                    <h3>一周口碑榜 <a href="#">更多榜单》</a></h3>

                </ul>
                <ul class="hotList">
                    <h2>热门片单</h2>
                    <li><a href="#">强势女性</a><span>276推荐</span></li>
                    <li><a href="#">中国大陆精品电视剧排行榜单</a><span>2130推荐</span></li>
                </ul>
                <div id="cooperate">
                    <h3>合作联系</h3>
                    <p>电影合作邮箱: movie@douban.com</p>
                    <p>电视剧合作邮箱: tv@douban.com</p>
                    <p>豆瓣影人PRO合作邮箱: pro@douban.com</p>
                </div>
                <div id="contact">
                    <h3>关注我们</h3>
                    <div class='allCon'>
                        <div class='cBox'>
                            <div class='img'><img
                                    src="https://img3.doubanio.com/f/movie/8f5f3bdbdc71bfd34eef8e3f16d13c857e59301b/pics/movie/home_weibo.png"
                                    alt=""></div>
                            <a href="#">微博</a>
                        </div>
                        <div class='cBox'>
                            <div class='img'><img
                                    src="https://img3.doubanio.com/f/movie/5d377d72b39a5cd2532813d1e42da3f34438a465/pics/movie/home_weixin.png"
                                    alt=""></div>
                            <a href="#">微信</a>
                        </div>
                        <div class='cBox'>
                            <div class='img'><img
                                    src="https://img3.doubanio.com/f/movie/8cf33706051d29ae3cf98091070f0ec2481959ed/pics/movie/bite_me@2x.jpg"
                                    alt=""></div>
                            <a href="#">瓣嘴</a>
                        </div>
                        <div class='cBox'>
                            <div class='img'><img
                                    src="https://img3.doubanio.com/f/movie/58304d3dae0aa268f2ba8e6ba4cd3a57a999d6fb/pics/movie/home_film_pro@2x.jpg"
                                    alt=""></div>
                            <a href="#">豆瓣影人PRO</a>
                        </div>
                        <div class='cBox'>
                            <div class='img'><img
                                    src="https://img3.doubanio.com/f/movie/cab17c6de1bfdaf598c9ae235738e20022f49e23/pics/movie/home_club@2x.jpg"
                                    alt=""></div>
                            <a href="#">观影club</a>
                        </div>
                    </div>
                </div>
                <div id="ad">
                    <div class='img'>
                        <img src="https://img2.doubanio.com/view/dale-online/dale_ad/public/8b73097fc2edde1.jpg" alt="">
                    </div>
                    <div class='con'>
                        <h4>天生一对,夏日必备</h4>
                        <p>豆瓣豆品</p>
                        <span>广告</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="hover">
        <!-- <h2><a href="#">夏日友情天</a></h2>
        <div class='star'>
            <div class="star1"><span class="rateH">22</span></div>
        </div>
        <span class='tag'>喜剧</span>
        <span class='tag'>动画</span>
        <span class='tag'>英语</span>
        <p>全智贤主演Netflix高分丧尸剧《王国》外传，7月23日Netflix上线！</p> -->
    </div>

    <div id="footer">
        <footer>
            <div>
                <span> © 2005－2021 douban.com, all rights reserved 北京豆网科技有限公司</span>
            </div>
            <ul>
                <li><a href="#">关于豆瓣</a></li>
                <li><a href="#">在豆瓣工作</a></li>
                <li><a href="#">联系我们</a></li>
                <li><a href="#">法律声明</a></li>
                <li><a href="#">帮助中心</a></li>
                <li><a href="#">移动应用</a></li>
                <li><a href="#">豆瓣广告</a></li>
            </ul>
        </footer>
    </div>
    <script>
        
    </script>
</body>

</html>